<template>
  <div class="home">
    <p>{{ msg }}</p>
    <button @click="changeMsg">修改msg</button>
  </div>
</template>

<script setup>
// @ is an alias to /src
// 引入ref使用
import { ref } from 'vue';

// 不是响应式,不可以同步修改页面的数据
// let msg = '普通朋友';
let msg = ref('普通朋友');
let changeMsg = () => {
  // 改变msg
  // 操作数据需要`.value`
  msg.value = '陈振北'
  console.log('改变数据方法执行了', msg);
};

</script>
